{extend name="public/layout" /}
{block name="head"}{/block}
{block name="body"}

<body>
  <div class="container-fluid p-t-15">
    <div class="card">
      <div class="card-header card-header-sm">
        <form id="search-form" class="form-inline">
          <div class="form-group">
            <input type="text" class="form-control" name="title@like" placeholder="请输入权限名称" />
          </div>
          <button type="button" onclick="helper.refreshTable()" id="search-btn" class="btn btn-default">
            <i class="mdi mdi-magnify"></i> 搜索
          </button>
        </form>
      </div>
      <div class="p-lr-15">
        <div class="toolbar">
          <a href="javascript:void(0);" class="btn btn-primary" onclick="doAction.add();"><i class="mdi mdi-plus"></i>
            添加</a>
        </div>
        <div class="table-responsive">
          <table id="grid" class="table"></table>
        </div>
      </div>
    </div>
  </div>
  <script>
    helper.bootstrapTable({
      url: "index.html",
      columns: [
        { field: "id", title: "#", width: "60", sortable: true },
        { field: "title", title: "权限组名称" },
        {
          field: "status", title: "状态", width: "120",
          formatter: function (value, row, index) {
            var checked = value == 1 ? 'checked' : '';
            return '<label class="switch switch-solid switch-primary">' +
              '<input type="checkbox" name="status" value="1" ' + checked + ' data-id="' + row.id + '" onchange="doAction.setStatus(this)">' +
              '<span></span>' +
              '</label>';
          }
        },
        {
          field: "operate", title: "操作", width: "160",
          formatter: function (value, row, index) {
            var html = '';
            html += '<a href="javascript:void(0);"  class="btn-xs btn btn-primary" onclick="doAction.edit(' + row.id + ')">' +
              '<i class="mdi mdi-pencil"></i> 编辑</a> ';
            html += '<a href="javascript:void(0)" class="btn-xs btn btn-danger" onclick="helper.doConfirm(this)"' +
              ' data-url="del.html" data-params="id=' + row.id + '" ' +
              'data-msg="确认要删除该权限组吗?"><i class="mdi mdi-archive"></i> 删除</a>';
            return html;
          }
        }
      ]
    });
    var doAction = {
      add: function () {
        helper.createTab({
          title: '添加权限组',
          url: '/system/auth_group/add.html'
        });
      },
      edit: function (id) {
        helper.createTab({
          title: '编辑权限组',
          url: '/system/auth_group/edit.html?id=' + id
        });
      },
      setStatus: function (obj) {
        var id = $(obj).data('id');
        layer.confirm('确认修改状态?', { icon: 3 },
          function (index) {
            helper.getAjax({
              url: '/system/auth_group/set.html',
              data: { id: id },
              success: function (res) {
                if (res.code == 0) {
                  $(obj).prop("checked", !$(obj).prop("checked"));
                  helper.tips(res.msg);
                }
                layer.close(index);
              }
            })
          },
          function (index) { //取消按钮
            $(obj).prop("checked", !$(obj).prop("checked"));
            layer.close(index);
          }
        )
      }
    }
  </script>
</body>
{/block}